<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<!--日志列表-->
<head>
    <meta charset="UTF-8">
    <title>气清</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="./js/cookie.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
<div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">日志管理</a>
        <a>
          <cite>日志列表</cite></a>
      </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>
<div class="x-body">
    <div class="layui-row">
        <div class="layui-inline layui-show-xs-block">
            <input type="text" name="name" id="adminName" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-inline layui-show-xs-block">
            <button class="layui-btn" data-type="reload">搜索</button>
            <!--                                    <i class="layui-icon">&#xe615;</i>-->
        </div>
    </div>
    <xblock>
        <button class="layui-btn layui-btn-danger" id="delall"><i class="layui-icon"></i>批量删除
        </button>
        <span class="x-right" style="line-height:40px"></span>
    </xblock>
    <table class="log-list" lay-filter="user">
    </table>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-danger layui-btn-mini btn-delete" lay-event="del">删除</a>
    </script>
</div>
<script th:inline="none">

    //layui自带的渲染网页tble格式
    layui.use(['layer', 'jquery', 'table', 'form', 'layedit','upload'], function () {
        var layedit = layui.layedit;
        $ = layui.jquery;
        var form = layui.form;
        var layer = layui.layer;
        var table = layui.table;
        var upload = layui.upload;

        table.render({
            elem: '.log-list',
            url: '/log-list/findLogByPage',
            cellMinWidth: 95,
            page: true,
            height: "312",
            limits: [10, 15, 20, 25],
            limit: 10,
            id: "logListTable",
            cols: [[
                {checkbox: true, align: 'center', LAT_CHECKED: false, filter: 'allChoose'},
                {field: 'id', title: '日志编号', minWidth: 80, align: "center", id: 'id'},
                {field: 'username', title: '登录用户', minWidth: 80, align: "center"},
                {field: 'method', title: '请求方法', minWidth: 80, align: "center"},
                {field: 'operation', title: '操作', minWidth: 80, align: "center"},
                {field: 'params', title: '请求参数', minWidth: 80, align: "center"},
                {field: 'time', title: '执行时长（毫秒）', minWidth: 80, align: 'center'},
                {field: 'ip', title: 'ip地址', minWidth: 80, align: 'center'},
                {
                    field: 'createdTime', title: '日志记录时间', minWidth: 80, align: 'center' ,templet: function (d) {
                        return layui.util.toDateString(d.createdTime / 1)}
                },
                {field: 'right', title: '操作', align: 'center', minWidth: 200, toolbar: "#barDemo"}

            ]]
        });
        //批量删除
        $("#delall").click(function () {
            var checkStatus = table.checkStatus("logListTable")
            if (checkStatus.data.length != 0) {
                var ids = [];
                var titles = []
                for (var i = 0; i < checkStatus.data.length; i++) {
                    ids.push(checkStatus.data[i].id);
                    titles.push(checkStatus.data[i].title)
                }
                var id = ids.join(",")
                var title = titles.join(",")
                layer.confirm('真的删除日志编号为' + id + '的记录吗？', function () {
                    $.post("/log-list/deleteLogsById", {"ids": id},
                        function (index) {
                            if (index.status == 200) {
                                layer.msg("删除成功", {icon: 6});
                                table.reload('logListTable', {})
                            } else {
                                layer.msg("删除失败", {icon: 5})
                                // table.reload('itemListTable', {});
                                layer.alert(index.data)
                            }
                        }, "json",);
                })
            } else {
                layer.msg("请勾选要删除的商品", {icon: 5})
            }
        });
        //按照title搜索
        var $ = layui.$, active = {
            reload: function () {
                var username = $('#adminName');
                if (username.val() == "") {

                    layer.msg("搜索用户名不能为空");
                    return;
                } else {
                    table.reload('logListTable', {
                        where: {
                            username: username.val(),
                        }
                    });
                }
            }
        }

        //绑定点击事件
        $(' .layui-btn ').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });



        table.on('tool(user)', function (obj) {
            var data = obj.data;
            //删除单个item
            if (obj.event === 'del') {
                console.log(data);
                layer.confirm('真的删除日志编号为' + data.id + '的记录吗？', function (index) {
                    $.ajax({
                        url: '/log-list/deleteLogById',
                        data: {'id': data.id},
                        method: 'get',
                        contentType: 'json',
                        //执行完成回调函数
                        success: function (data) {
                            console.log(data)
                            if (data.status == 200) {
                                layer.close(index);
                                layer.msg("删除成功", {icon: 6});
                                //表格刷新
                                table.reload('logListTable', {});
                            } else {
                                layer.msg("删除失败", {icon: 5})
                                // table.reload('itemListTable', {});
                                layer.alert(data.data)
                            }
                        }
                    })
                    layer.close(index);
                });
            }
        })
    });


</script>

</body>

</html>